<!-- BEGIN: Subheader -->
<div class="m-subheader" appunwraptag="">
	<div class="d-flex align-items-center">
		<div class="mr-auto">
			<h3 class="m-subheader__title m-subheader__title--separator">
				发博文
			</h3>
			<ul class="m-subheader__breadcrumbs m-nav m-nav--inline">
				<li class="m-nav__item m-nav__item--home">
					<a routerLink="/" href="#" class="m-nav__link m-nav__link--icon">
						<i class="m-nav__link-icon la la-home"></i>
					</a>
				</li>
				<li class="m-nav__separator">
					-
				</li>
				<li class="m-nav__item">
					<a routerLink="/blog" href="" class="m-nav__link">
						<span class="m-nav__link-text">
							博客
						</span>
					</a>
				</li>
				<li class="m-nav__separator">
					-
				</li>
				<li class="m-nav__item">
					<a href="#" class="m-nav__link">
						<span class="m-nav__link-text">
							发博客
						</span>
					</a>
				</li>

			</ul>
		</div>
		<div>
			<div class="m-dropdown m-dropdown--inline m-dropdown--arrow m-dropdown--align-right m-dropdown--align-push" data-dropdown-toggle="hover" aria-expanded="true">
				<a href="#" class="m-portlet__nav-link btn btn-lg btn-secondary  m-btn m-btn--outline-2x m-btn--air m-btn--icon m-btn--icon-only m-btn--pill  m-dropdown__toggle">
					<i class="la la-plus m--hide"></i>
					<i class="la la-ellipsis-h"></i>
				</a>
				<div class="m-dropdown__wrapper">
					<span class="m-dropdown__arrow m-dropdown__arrow--right m-dropdown__arrow--adjust"></span>
					<div class="m-dropdown__inner">
						<div class="m-dropdown__body">
							<div class="m-dropdown__content">
								<ul class="m-nav">
									<li class="m-nav__section m-nav__section--first m--hide">
										<span class="m-nav__section-text">
											快捷菜单
										</span>
									</li>
									<li class="m-nav__item">
										<a routerLink="/blog/category" href="" class="m-nav__link">
											<i class="m-nav__link-icon flaticon-share"></i>
											<span class="m-nav__link-text">
												分类管理
											</span>
										</a>
									</li>
									<li class="m-nav__item">
										<a routerLink="/blog/comment" href="" class="m-nav__link">
											<i class="m-nav__link-icon flaticon-chat-1"></i>
											<span class="m-nav__link-text">
												博客评论
											</span>
										</a>
									</li>
									<li class="m-nav__item">
										<a href="" class="m-nav__link">
											<i class="m-nav__link-icon flaticon-info"></i>
											<span class="m-nav__link-text">
												FAQ
											</span>
										</a>
									</li>
									<li class="m-nav__item">
										<a href="" class="m-nav__link">
											<i class="m-nav__link-icon flaticon-lifebuoy"></i>
											<span class="m-nav__link-text">
												Support
											</span>
										</a>
									</li>
									<li class="m-nav__separator m-nav__separator--fit"></li>
									<li class="m-nav__item">
										<a href="#" class="btn btn-outline-danger m-btn m-btn--pill m-btn--wide btn-sm">
											刷新
										</a>
									</li>
								</ul>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
<!-- END: Subheader -->
<div class="m-content">
	<!--begin::Portlet-->
	<div class="m-portlet">
		<div class="m-portlet__head">
			<div class="m-portlet__head-caption">
				<div class="m-portlet__head-title">
					<h3 class="m-portlet__head-text">
						编辑博客
					</h3>
				</div>
			</div>
		</div>
		<!--begin::Form-->
		<form (ngSubmit)="publish()" #f="ngForm" class="m-form m-form--fit m-form--label-align-right">
			<div class="m-portlet__body">
				<div class="m-form__section m-form__section--first">
					<div class="form-group m-form__group row">
						<label class="col-lg-3 col-form-label">
							标题:
						</label>
						<div class="col-lg-6">
							<input type="text" [(ngModel)]="ann_blog.title" name="title" #title="ngModel" class="form-control m-input" placeholder="请输入博客标题">
							<span class="m-form__help">
								文章标题，好的标题更容易被关注
							</span>
						</div>
					</div>
					<div class="form-group m-form__group row">
						<label class="col-lg-3 col-form-label">
							描述:
						</label>
						<div class="col-lg-6">
							<input type="text" [(ngModel)]="ann_blog.summary" name="summary" #summary="ngModel" class="form-control m-input" placeholder="请输入描述">
							<span class="m-form__help">
								摘要，描述信息
							</span>
						</div>
					</div>
					<div class="form-group m-form__group row">
						<label class="col-lg-3 col-form-label">
							来源：
						</label>
						<div class="col-lg-6">
							<div class="input-group">
								<div class="input-group-prepend">
											<span class="input-group-text">
												<i class="la la-chain"></i>
											</span>
								</div>
								<input type="text" [(ngModel)]="ann_blog.url" name="url" #url="ngModel" class="form-control m-input" placeholder="请输入来源链接地址">
								<span class="m-form__help">
									原创内容请留空
								</span>
							</div>
						</div>
					</div>
                    <div class="m-form__group form-group row">
                        <label class="col-3 col-form-label">
                            主分类:
                        </label>
                        <div class="col-9">
                            <div class="m-radio-inline">
                                <label *ngFor="let c of blog_category" class="m-radio">
                                    <input type="radio" name="cid" (change)="mainCategory(c)" value="{{c.id}}">
                                    {{c.name}}
                                    <span></span>
                                </label>

                            </div>
                            <span class="m-form__help">
								单选（选择唯一的主分类）
							</span>
                        </div>
                    </div>
					<div class="m-form__group form-group row">
						<label class="col-lg-3 col-form-label">
							扩展分类:
						</label>
						<div class="col-lg-6">
							<div class="m-checkbox-inline">
								<label *ngFor="let c of blog_category" class="m-checkbox">
									<input name="extra_cid" value="{{c.id}}"  (change)="extraCategory(c)" type="checkbox">
									{{c.name}}
									<span></span>
								</label>
                                <span class="m-form__help">
                                   多选（扩展的分类）
                                </span>
							</div>
						</div>
					</div>
				</div>
			</div>
			<div class="m-portlet__body">
				<div class="form-group m-form__group row has-warning">
					<label class="col-form-label col-lg-3 col-sm-12">
						正文:
					</label>
					<div class="col-lg-9 col-md-9 col-sm-12">
						<div class="summernote"></div>
						<div [hidden]="contentAlert" class="form-control-feedback">
							文章内容不能为空！
						</div>
						<span class="m-form__help">
							编辑文章详情！.
						</span>
					</div>
				</div>

			</div>
            <div class="m-portlet__body">
                <div class="m-form__section m-form__section--first">
                    <div class="form-group m-form__group row">
                        <label class="col-lg-3 col-form-label">
                            封面:
                        </label>
                        <div class="col-lg-6">
                            <nz-upload
                                    [nzAction]="coverUploadUrl"
                                    nzListType="picture-card"
                                    nzAccept="image/*"
                                    [nzData]="coverFormData"
                                    [nzHeaders]="coverUploadHeaders"
                                    [nzSize]="5000"
                                    [nzLimit]="5"
                                    [nzMultiple]="true"
                                    [(nzFileList)]="fileList"
                                    [nzShowButton]="fileList.length < 5"
                                    [nzPreview]="coverPreviewHandle"
                                    (nzChange)="coverChange($event)"
                                    >
                                <i class="anticon anticon-plus"></i>
                                <div class="ant-upload-text">上传图片</div>
                            </nz-upload>
                            <nz-modal [nzVisible]="previewVisible" [nzContent]="modalContent" [nzFooter]="null" (nzOnCancel)="previewVisible=false">
                                <ng-template #modalContent>
                                    <img [src]="previewImage" [ngStyle]="{ 'width': '100%' }" />
                                </ng-template>
                            </nz-modal>
                        </div>
                    </div>
                </div>
            </div>

			<div class="m-portlet__foot m-portlet__foot--fit">
				<div class="m-form__actions m-form__actions">
					<div class="row">
						<div class="col-lg-9 ml-lg-auto">
							<button type="submit" class="btn btn-primary">
								保存
							</button>
							<button (click)="clearForm($event)"  type="reset" class="btn btn-secondary">
								重置
							</button>
						</div>
					</div>
				</div>
			</div>
		</form>
		<!--end::Form-->
	</div>
	<!--end::Portlet-->
</div>
